<template>
    <div class="search-div">
        <!--- 表格数据 -->
        <el-table :data="list" style="width: 100%">
            <el-table-column prop="id" label="编号" />
            <el-table-column prop="followUpDoctor" label="患者名称" />
            <el-table-column prop="deviceName" label="设备类型" />
            <el-table-column prop="dueDate" label="租借日期" />
            <el-table-column label="操作" align="center" width="280" #default="scope">
            <el-button type="success" size="small" @click="getSid(scope.row)">申请</el-button>
            <el-button type="success" size="small" @click="getIid(scope.row)">审核</el-button>
            <el-button type="success" size="small" @click="getAid(scope.row)">押金</el-button>
            <el-button type="success" size="small" @click="getJid(scope.row)">租金</el-button>
            <el-button type="danger" size="small" @click="deleteById(scope.row)">删除</el-button>
            </el-table-column>
        </el-table>
  
        <!--分页条-->
        <el-pagination
                    v-model:current-page="pageParams.page"
                    v-model:page-size="pageParams.limit"
                    :page-sizes="[10, 20, 50, 100]"
                    @size-change="fetchData"
                    @current-change="fetchData"
                    layout="total, sizes, prev, pager, next"
                    :total="total"
        />
  </div>
  </template>
  
  <script setup>
  import { ref,onMounted } from 'vue';
  import {findDevicePatientAssociation, updateSid, updateIid, updateAid, updateJid } from '@/api/equipment/devicePatientAssociation';
  import {GetEquipmentListByPage} from '@/api/equipment/equipment'; 
  import {GetSysRoleListByPage} from '@/api/zsg/patient';
  import {GetAuditListByPage} from '@/api/equipment/audit';
  import {GetDeviceList} from '@/api/equipment/device';
  import { ElMessage, ElMessageBox } from 'element-plus';
  const defaultProps={
    children: "children",
    label: "title",
  }
  const dis=ref(true)
  // const dialogMenuVisible=ref(false)
  // const sysMenuTreeList=ref([])
  
  const tree=ref()
  //分页条件总记录数
  let total = ref(0)
  
  //定义表格数据模型
  const list = ref([])
  const deviceList = ref([])
  const devicePatientAssociationList=ref({})
  const auditList=ref({})
  const RoleList=ref({})
  
  
  //分页数据
  const pageParamsForm = {
    page: 1,//页码
    limit: 5, //每页记录数
  }
  
  const pageParams = ref(pageParamsForm)
  
  // 控制对话是否展示的变量
  const dialogVisible = ref(false)
  
  // //表单数据模型
  // const defaultForm = {
  //   id: "",
  //   sId: "",
  //   snId: "",
  //   name: "",
  //   deviceType: "",
  //   createTime: "",
  //   bId: "",
  //   states: "",
  //   isDeleted: "",
  //   deviceName: "",
  //   sName: "",
  //   store: ""
    
  // }
  
  // const equipment = ref(defaultForm)
  
  //钩子函数
  onMounted(()=>{
    fetchData();
    fetchDataDevice();
    // findAuditListByPage();
    GetDevicePatientAssociationList();
    findSysRoleListByPage();
  })
  
  const fetchData = async()=>{
    const {data,code,message} = await findDevicePatientAssociation(pageParams.value.page,pageParams.value.limit);
    list.value=data.list;
    total.value=data.total;
  }
  const fetchDataDevice = async()=>{
      const {data,code,message} = await GetDeviceList();
      deviceList.value=data.list;
  }
  
  // const findAuditListByPage = async()=>{
  //   const {data,code,message} = await GetAuditListByPage();
  //   auditList.value=data.list;
  // }
  
  const GetDevicePatientAssociationList = async()=>{
    const {data,code,message} = await findDevicePatientAssociation();
    devicePatientAssociationList.value=data.list;
  }
  
  const findSysRoleListByPage = async()=>{
    const {data,code,message} = await GetSysRoleListByPage();
    RoleList.value=data.list;
  }

  //删除设备
  const deleteById = (row) => {
    ElMessageBox.confirm('此操作将永久删除该记录, 是否继续?', 'Warning', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(async()=>{
       const {code } = await DeleteEquipmentById(row.id)
       if(code === 200) {
            ElMessage.success('删除成功')
            pageParams.value.page = 1
            fetchData()
       }
    })
  }
  
  //申请设备
  const getSid = (row) => {
    ElMessageBox.confirm('此操作将启用该设备, 是否继续?', 'Warning', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(async()=>{
       const {code } = await updateSid(row.id)
       if(code === 200) {
            ElMessage.success('开启成功')
            pageParams.value.page = 1
            fetchData()
       }
    })
  }

    //审核设备
    const getIid = (row) => {
    ElMessageBox.confirm('此操作将启用该设备, 是否继续?', 'Warning', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(async()=>{
       const {code } = await updateIid(row.iid)
       if(code === 200) {
            ElMessage.success('开启成功')
            pageParams.value.page = 1
            fetchData()
       }
    })
  }
  //押金状态
  const getAid = (row) => {
    ElMessageBox.confirm('此操作将停用该设备, 是否继续?', 'Warning', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(async()=>{
       const {code } = await updateAid(row.aid)
       if(code === 200) {
            ElMessage.success('停用成功')
            pageParams.value.page = 1
            fetchData()
       }
    })
  }

      //租金状态
      const getJid = (row) => {
    ElMessageBox.confirm('此操作将启用该设备, 是否继续?', 'Warning', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(async()=>{
       const {code } = await updateJid(row.jid)
       if(code === 200) {
            ElMessage.success('开启成功')
            pageParams.value.page = 1
            fetchData()
       }
    })
  }
  
  // const state = (row) => {
  //       return row.states === 1?"正常" :row.states === 2?"禁用":"损坏";
  // }
  
  </script>
  
  <style scoped>
  
  .search-div {
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #ebeef5;
  border-radius: 3px;
  background-color: #fff;
  }
  
  .tools-div {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #ebeef5;
  border-radius: 3px;
  background-color: #fff;
  }
  
  </style>